<%@page import="org.proddevplm.dao.data.designForX.DesignForX"%>
<%@page import="java.util.List"%>
<%@page import="org.proddevplm.constants.ControllerConstants"%>
<%@page import="org.proddevplm.business.administration.constants.AdminConstants"%>

<script>

	$(function(){
		$("button").button();
		$("#newDfXDiv").hide();
	
		$("#dfxTable").tablesorter({
			widgets:['zebra']
		});
	})
	
	function loadDfXWithReq(request, page){
		$.post(request, function(data) {
            $("#editDfXDiv").load(page);
        });
	}
	
	function addNewDfX(){
		$("#showDB").hide();
		$("#addNewDfX").hide();
		$("#newDfXDiv").show();
	}
	
	function editDFX(id){
		$("#showDB").hide();
		$("#addNewDfX").hide();
		
		loadDfXWithReq("/proddev/controller?manager=adminManager&method=13&dfxId="+id,"content/project/administration/editDFX.jsp")
	}

</script>

<%
	List<DesignForX> allDFXInDB = (List)session.getAttribute("allDFXInDB");
%>

<div style="width:100%">
		
	<div id="showDB" style="width:100%; margin-top:20px; ">
		<div class="pageTitle" style="text-align:center; font-weight:bold;">
			Current Design for X concepts saved in the Database
		</div>
		<table id="dfxTable" class="tablesorter" style="width:100%" rules="rows" frame="hsides" bordercolor="#DBDBDB">
			<thead>
				<tr>
					<th style="width:5%">DfX ID</th>
					<th style="width:20%">Design for X concept</th>
					<th>Detailed information</th>
					<th style="width:5%">Action</th>
				</tr>
			</thead>
			<tbody>
				<%for(int i=0; i<allDFXInDB.size(); i++){ 
					DesignForX dfx = allDFXInDB.get(i);%>
					<tr>
						<td style="text-align:center"><%=dfx.getId() %></td>
						<td><%=dfx.getDfxName() %></td>
						<td><%=dfx.getInfo() %></td>
						<td style="text-align:center">
							<img src="/proddev/images/edit.png" onclick="editDFX('<%=dfx.getId()%>')" align="middle" width="20" height="20"/>
						</td>
					</tr>
				<%} %>
			</tbody>
		</table>
		
	</div>
	
	<button id="addNewDfX" name="addNewDfX" onclick="addNewDfX()" style="width:20%; font-size:x-small; font-weight: bold;">Add new Design for X concept</button>
	
	<div id="newDfXDiv" class="containerSmall" style="width:60%; margin-top:20px">
		<form name="addDFXForm" method="post" action="/proddev/controller" style="margin:0">
			<input type = "hidden" name = "<%=ControllerConstants.MANAGER_KEY%>" value = "<%=ControllerConstants.ADMIN_MANAGER%>"/>
			<input type = "hidden" name = "<%=ControllerConstants.METHOD_KEY%>" value = "<%=AdminConstants.ADD_DFX%>"/>
	
		
			<div class="pageTitle" style="font-weight:bold">
				Add new Design for X concept
			</div>
			
			<div style="margin-top:10px; font-weight:bold">
				Design for X
			</div>
			<input class="regInput" id="newDfX" name="newDfX" style=" width:100%; margin-top:5px;"/>
			
			<div style="margin-top:10px; font-weight:bold">
				Please add detailed information about the concept
			</div>
			<textarea class="regInput" id="dfXDetailedInfo" name="dfXDetailedInfo" rows="4" style=" width:100%; margin-top:5px;"></textarea>
			
			<button id="addDfXConcept" name="addDfXConcept" style="width:40%; margin-top:10px; font-weight:bold">Add DfX Concept</button>
		</form>
		
	</div>
	
	<div id="editDfXDiv">
		
	</div>
</div>